<template>
  <div class="home">
    <h1>添加数据，需要带上token</h1>
    <p>标题：<input type="text" v-model="list.title"></p>
    <p>内容：<textarea type="text" v-model="list.content"></textarea></p>
    <p>作者：<input type="text" v-model="list.author"></p>
    <button @click="submit">提交数据</button>
    <hr />
    <input v-model="keyword"> <button @click="searchClick">搜索</button>
    <hr>
    <h1>模糊搜索</h1>
    <template>
      <ul>
        <li v-for="(item, index) in searchList" :key="index">
          {{item.title}}
          {{item.content}}
          {{item.author}}
        </li>
      </ul>
    </template>
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'
import { postList,getSearch } from '@/api/index'
export default {
  name: 'Home',
  data() {
    return {
      keyword: '',
      list: {
        title: '',
        content: '',
        author: ''
      },
      searchList: []
    }
  },
  methods: {
    searchClick() { 
      getSearch({keyword: this.keyword}).then(res => {
        console.log(res, 'res')
        this.searchList = res.data
      })
    },
    submit() {
      // 新增数据接口
      postList({...this.list}).then(res => {
        // 接口访问 需要带上token
        console.log(res, 'res----res')
      }) 
    }
  },
  components: {
    HelloWorld
  }
}
</script>
